<template>
    <h3>{{ author.name }}</h3>
    <h3>{{  this.booksStr = 'John Doe' }}</h3>
    <p>{{ hasBooks }}</p>
    <p>{{ hasBooks2() }}</p>
</template>

<script>
export default {
    data() {
        return {
            author: {
                name: 'John Doe',
                firstName: 'John',
                lastName: 'Doe',
                books: [
                    'Vue 2 - Advanced Guide',
                    'Vue 3 - Basic Guide',
                    'Vue 4 - The Mystery'
                ]
            }
        }
    },
    //计算属性
    computed: {
        hasBooks() {
            return this.author.books.length > 0 ? 'YES' : 'NO'
        },
        booksStr: {
            get() {
                return this.author.firstName +' ' + this.author.lastName;
            },
            set(value) {
                [this.author.firstName, this.author.lastName] = value.split(' ');
            }
        }
    },
    methods: {
        hasBooks2() {
            return this.author.books.length > 0 ? 'YES' : 'NO';
        }
    }

}
</script>